Unidad 8
basado en tom mock, mine centikaya
y elaboración propia. artwork por allison horst
Quarto® es un nuevo sistema de publicación científica y técnica de código abierto construido sobre Pandoc 1
Mezcla texto narrativo y código para producir resultados con un formato elegante en documentos, tableros interactivos, páginas web, publicaciones de blogs, libros y más.
Es independiente del lenguaje R (incluso trabaja con otros lenguajes como Python y Julia).
knitr + rmarkdown se volcaron al desarrollo de Quarto.Quarto usa knitr o jupyter como motor para ejecutar código y generar una salida temporal (.md).
El archivo temporal se procesa mediante los filtros Lua de Pandoc y Quarto + Bootstrap CSS para HTML o LaTeX para PDF y se convierte a un formato de salida final.
Los filtros Lua escritos por desarrolladores de R/Python/Julia son intercambiables entre formatos.
Quarto además incluye soporte nativo para Observable JS, un conjunto de mejoras a JavaScript básico creado por Mike Bostock (también autor de D3).
Observable JS se distingue por su tiempo de ejecución reactivo, que es especialmente adecuado para la exploración y el análisis de datos interactivos.
Conversor de temperatura de ℃ a ℉
Celsius = ℃ y Fahrenheit = ℉.
Quarto es una interfaz de línea de comandos (CLI) que representa formatos de texto sin formato (.qmd, .rmd, .md) o formatos mixtos (.ipynb/Jupyter notebook) en informes estáticos PDF/Word/HTML, libros, sitios web, presentaciones y más.
cballejo$ quarto --help
Usage: quarto
Version: 1.6.40
Description:
Quarto CLI
Options:
-h, --help - Show this help.
-V, --version - Show the version number for this program.
Commands:
render [input] [args...] - Render input file(s) to various document types.
preview [file] [args...] - Render and preview a document or website project.
serve [input] - Serve a Shiny interactive document.
create-project [dir] - Create a project for rendering multiple documents
convert <input> - Convert documents to alternate representations.
pandoc [args...] - Run the version of Pandoc embedded within Quarto.
run [script] [args...] - Run a TypeScript, R, Python, or Lua script.
install <type> [target] - Installs an extension or global dependency.
publish [provider] [path] - Publish a document or project. Available providers include:
check [target] - Verify correct functioning of Quarto installation.
help [command] - Show this help or the help of a sub-command. El sitio web de Quarto es https://quarto.org/
La versión actual es 1.6.40 (Windows) del 03/05/2025
La guía oficial se puede encontrar en https://quarto.org/docs/guide/
RStudio Desktop incluye una versión de Quarto en su instalación desde la versión 2022.07.01 pero conviene actualizarlo de forma independiente
.rmd (RMarkdown) o .ipynb (cuadernos jupyter de python) con Quarto.htmlwidgets en R y Jupyter widgets para Python/Julia además de Observable JSQuartoQuarto seguirá funcionando.qmdAl igual que los .Rmd de RMarkdown el archivo fuente de Quarto es de texto plano
Suele tener código incluido
Los archivos .qmd responden estructuralmente al modelo de programación literaria (Literate programming)
.qmd tienen son procesados en muchas etapas del renderizado y puede influir en el documento final de varias formas.Quarto se basa en Pandoc y utiliza su variación de Markdown como sintaxis para documentos.(El radio del circulo es `{r} radio`). El radio del circulo es 5
typst es un nuevo sistema de composición tipográfica basado en marcas para ciencia.
RStudio (también algunos otros editores como VSCode) integran entre sus herramientas la finalización enriquecida: podemos comenzar con una palabra y tabular (TAB) para completar, o presionar Ctrl + espacio para ver todas las opciones disponibles.
Inicialmente y para el uso general conviene aprovechar el modo Visual de RStudio para incorporar marcas de lenguaje Markdown. Prácticamente todos los elementos incorporados con formato markdown aplican en los diferentes formatos de salida (HTML, pdf, etc)
Pandoc y, por tanto, Quarto aceptan bloques Divs y Spans propios del HTML con sintaxis delimitada por :::
Estructura general:
{.class} o {varias-clase}::: {style="border-left:10px solid purple"}
Este contenido tiene un diseño de borde izquierdo violeta
:::
Este contenido tiene un diseño de borde izquierdo violeta
<div> HTML pero que también sirve cuando la salida es en PDF.El formato básico de un bloque de llamadas es:
::: {.callout-*}
## Título del bloque
Texto incluído
:::
donde el * se reemplaza por el tipo de bloque. Además se puede configurar la apariencia y si se muestra o no el ícono asociado.
Nota
Existen cinco tipos de leyendas, que incluyen: note (nota), tip (consejo), warning (advertencia), caution (precaución), e important (importante)
Advertencia
Estos bloques facilitan una forma sencilla de llamar la atención, por ejemplo, sobre esta advertencia.
Importante
Se pueden editar los titulos con doble #. Por ejemplo: ## Importante
Consejo
Tip o consejo dado
Precaución
Esto se encuentra bajo construcción
Estructura general:
{.class} o {varias-clases}[texto]{.class}
<span .class>Texto</span> de HTML pero nuevamente estos son compatibles para aplicar atributos nativos de Pandoc/Quarto.Este es un texto con formato [especial]{style=“color:orange;”}.
Este es un texto con formato especial.

{width=120%}
{fig-align=“left”}
Las columnas se construyen con bloques Divs ::: columns y luego ::: {.column width=“50%”} para cada una de ellas (en este ejemplo que son 2). Cada bloque se cierra con :::
{fig-align=“right” .lightbox}
La opción .lightbox utiliza la librería de javascript GLightbox para mostrar un efecto sobre la imagen cuando pulsamos sobre ella.
Las pestañas son un bloque Divs especiales ::: {.panel-tabset} :::
El nombre de cada pestaña se establece con ## Nombre
Al ser dinámicas, solo funcionan en salidas HTML.
Sepal.Length Sepal.Width Petal.Length Petal.Width Species
1 5.1 3.5 1.4 0.2 setosa
2 4.9 3.0 1.4 0.2 setosa
3 4.7 3.2 1.3 0.2 setosa
4 4.6 3.1 1.5 0.2 setosa
5 5.0 3.6 1.4 0.2 setosa
6 5.4 3.9 1.7 0.4 setosa
Existen varios tipos de “enlaces” o hipervínculos.
Markdown
Se pueden insertar links en formato Markdown vinculados
a un texto como este de [Quarto](https://quarto.org/),
URL directas como <https://www.ine.gov.ar/> y
enlaces a [otros lugares](#docu-estaticos-title)
en el mismo documento.
La sintaxis es similar a incrustar un imagen en línea:
. Salida
Se pueden insertar links en formato Markdown vinculados a un texto como este de Quarto, URL directas como https://www.ine.gov.ar/ y enlaces a otros lugares en el mismo documento. La sintaxis es similar a incrustar un imagen en línea: .
Listas sin orden:
Salida
Listas ordenadas:
Markdown:
> Cambiemos nuestra actitud tradicional hacia la construcción
> de programas: en lugar de imaginar que nuestra tarea principal
> es indicarle a una computadora qué hacer, concentrémonos más
> bien en explicar a los seres humanos lo que queremos que haga
> una computadora. - Donald KnuthSalida:
Cambiemos nuestra actitud tradicional hacia la construcción de programas: en lugar de imaginar que nuestra tarea principal es indicarle a una computadora qué hacer, concentrémonos más bien en explicar a los seres humanos lo que queremos que haga una computadora. - Donald Knuth
Tablas Markdown
Markdown:
| Derecha | Izquierda | Predeterminado | Centrado |
|--------:|:----------|----------------|:--------:|
| 12 | 12 | 12 | 12 |
| 123 | 123 | 123 | 123 |
| 1 | 1 | 1 | 1 |Salida:
| Derecha | Izquierda | Predeterminado | Centrado |
|---|---|---|---|
| 12 | 12 | 12 | 12 |
| 123 | 123 | 123 | 123 |
| 1 | 1 | 1 | 1 |
Las tablas cuadrícula son un tipo más avanzado de tablas de Markdown que permiten otros elementos (múltiples párrafos, bloques de código, listas, etc.)
Markdown:
+---------------+---------------+--------------------+
| Formato | Extensión | Ventajas |
+===============+===============+====================+
| Documento | pdf | - Seguro |
| portable | | - Universal |
+---------------+---------------+--------------------+
| Word | docx | - Editable |
| | | - Universal |
+---------------+---------------+--------------------+
: Ejemplo tabla cuadrícula Salida:
| Formato | Extensión | Ventajas |
|---|---|---|
| Documento portable |
|
|
| Word | docx |
|
+--------------------+---------------+--------------------+
| Derecha | Izquierda | Centrado |
+===================:+:==============+:==================:+
| Documento portable | pdf | - Seguro |
+--------------------+---------------+--------------------+
+--------------:+:--------------+:------------------:+
| Derecha | Izquierda | Centrado |
+---------------+---------------+--------------------+
Tengamos en cuenta que las tablas cuadrícula son bastante complicadas de escribir con un editor de texto plano porque, a diferencia de las tablas comunes, los indicadores de columna deben alinearse.
¡El Editor Visual puede ayudar a crear estas tablas! para profundizar ver Guía Quarto
También podemos utilizar herramientas online como TablesGenerator
Al igual que en RMarkdown se puede insertar fórmulas matemáticas Latex en linea o en imagen completa, utilizando $ o $$ según corresponda.
\[ R(t)= A \left(\frac{E_0}{\rho_0}\right)^{1/5}t^{2/5} \]
En el modo Visual se pueden insertar facilmente caracteres especiales de distinto tipo, emojis y listas de términos. Por ejemplo:
Caracteres especiales:
② ≋ 𝄞 ⍾ ◴ ⭆
Emojis:
😀 🥶 👍 🤡
Listas de definición
Es una plantilla que define las características y comportamientos de una entidad
Quarto tiene soporte nativo para incrustar diagramas Mermaid y Graphviz . Esto permite crear diagramas de flujo, diagramas de secuencia, diagramas de estado, diagramas de Gantt y otros utilizando una sintaxis de texto plano inspirada en Markdown.
```{{mermaid}}
flowchart LR
A[Inicio] --> B(Pre-proceso)
B --> C{Decisión}
C --> D[Resultado 1]
C --> E[Resultado 2]
```En todo documento Quarto se puede incluir código de diferentes lenguajes de programación (R, python, julia, javascript, etc).
Habitualmente el código sirve para mostrar resultados estadísticos en forma de tabla y/o gráfico. Otras veces el código produce diversas tareas que no se muestran hasta tanto se produzca la salida de resultados. Y en ocasiones, cuando el producto tiene un fin docente sobre el lenguaje de programación en si, se muestran las líneas de código junto a lo que produce.
Toda la ejecución del código se maneja desde las opciones de ejecución que se configuran como metadatos dentro de los fragmentos (chunks).
Algunas de las opciones de control de ejecución de los chunck de código.
| Opción | Descripción |
|---|---|
eval |
Evalua el codigo del chunk (si es false, saltea el código y no lo ejecuta). |
echo |
Incluye el código fuente en la salida |
output |
Incluye el resultado de la ejecución del código en la salida (true, false, or asis para indicar que muestre los resultados en forma cruda). |
warning |
Gestiona las advertencias en la salida. |
error |
Gestiona los errores en la salida. |
include |
Evita que se incluya cualquier salida (código o resultados) (por ejemplo include: false suprime toda la salida del bloque de código). |
message |
Gestiona los mensajes en la salida |
fig-* |
Familia de opciones para las figuras (alto, ancho, alineación, nombre, resolución, etc) |
Salida directa, igual que en consola y estéticamente feas.
# A tibble: 6 × 8
especie isla largo_pico_mm alto_pico_mm largo_aleta_mm masa_corporal_g sexo
<fct> <fct> <dbl> <dbl> <int> <int> <fct>
1 Adelia Torge… 39.1 18.7 181 3750 macho
2 Adelia Torge… 39.5 17.4 186 3800 hemb…
3 Adelia Torge… 40.3 18 195 3250 hemb…
4 Adelia Torge… NA NA NA NA <NA>
5 Adelia Torge… 36.7 19.3 193 3450 hemb…
6 Adelia Torge… 39.3 20.6 190 3650 macho
# ℹ 1 more variable: anio <int>
El paquete knitr, incuído en RStudio, puede convertir las salidas estos dataframes en tablas visuales con knitr::kable():
| especie | isla | largo_pico_mm | alto_pico_mm | largo_aleta_mm | masa_corporal_g | sexo | anio |
|---|---|---|---|---|---|---|---|
| Adelia | Torgersen | 39.1 | 18.7 | 181 | 3750 | macho | 2007 |
| Adelia | Torgersen | 39.5 | 17.4 | 186 | 3800 | hembra | 2007 |
| Adelia | Torgersen | 40.3 | 18.0 | 195 | 3250 | hembra | 2007 |
| Adelia | Torgersen | NA | NA | NA | NA | NA | 2007 |
| Adelia | Torgersen | 36.7 | 19.3 | 193 | 3450 | hembra | 2007 |
| Adelia | Torgersen | 39.3 | 20.6 | 190 | 3650 | macho | 2007 |
Existen numerosos paquetes para darle formato a las tablas producidas mediante código.
Un ejemplo muy completo es el paquete flextable, que vimos en clases anteriores.
Además de salidas HTML es compatible con pdf y Word (docx).
La documentación se encuentra en este enlace
especie | isla | largo_pico_mm | alto_pico_mm | largo_aleta_mm | masa_corporal_g | sexo | anio |
|---|---|---|---|---|---|---|---|
Adelia | Torgersen | 39,1 | 18,7 | 181 | 3750 | macho | 2007 |
Adelia | Torgersen | 39,5 | 17,4 | 186 | 3800 | hembra | 2007 |
Adelia | Torgersen | 40,3 | 18,0 | 195 | 3250 | hembra | 2007 |
Adelia | Torgersen | N/A | N/A | N/A | N/A | 2007 | |
Adelia | Torgersen | 36,7 | 19,3 | 193 | 3450 | hembra | 2007 |
Adelia | Torgersen | 39,3 | 20,6 | 190 | 3650 | macho | 2007 |
Otro paquete para tablas elaboradas es gt.
Aquí podemos encontrar todo lo que ofrece.
| especie | isla | largo_pico_mm | alto_pico_mm | largo_aleta_mm | masa_corporal_g | sexo | anio |
|---|---|---|---|---|---|---|---|
| Adelia | Torgersen | 39.1 | 18.7 | 181 | 3750 | macho | 2007 |
| Adelia | Torgersen | 39.5 | 17.4 | 186 | 3800 | hembra | 2007 |
| Adelia | Torgersen | 40.3 | 18.0 | 195 | 3250 | hembra | 2007 |
| Adelia | Torgersen | NA | NA | NA | NA | NA | 2007 |
| Adelia | Torgersen | 36.7 | 19.3 | 193 | 3450 | hembra | 2007 |
| Adelia | Torgersen | 39.3 | 20.6 | 190 | 3650 | macho | 2007 |
```{r}
#| fig-width: 5
#| fig-height: 3
#| fig-cap: "Tamaño de los pingüinos en
tres islas del Archipelago Palmer."
#| fig-alt: "Diagrama de dispersión que
muestra el tamaño de los picos de los
pingüinos en tres islas"
library(datos)
library(ggplot2)
pinguinos |>
ggplot(aes(x = largo_pico_mm,
y = alto_pico_mm,
col = isla)) +
geom_point()
```Los documentos HTML renderizados con Quarto usan Bootstrap 5 de forma predeterminada. Esto se puede personalizar a través de la opción de theme: en la cabecera YAML.
theme: default # bootstrap 5 predeterminado
theme: cosmo # tema cosmo bootswatch
theme: pandoc # tratamiento de pandoc predeterminado
theme: none # no usa ningún tema css Quarto incluye 25 temas del proyecto Bootswatch, entre los cuales se encuentran: lumen, minty, journal, etc.
En la cabecera YAML, junto al tema se puede definir algunas variables estéticas que se usarán al renderizar el documento, como mainfont, fontsize, fontcolor, etc.
Podemos realizar una amplia personalización de temas utilizando Sass. Existen más de 1400 variables Sass que controlan fuentes, colores, relleno, bordes y mucho más.
Este idioma, extensión de CSS, se utiliza en archivos .scss que se incluyen en la cabecera YAML.
El contenido del archivo custom.scss, que debe estar ubicado en la misma carpeta donde está el .qmd, podría ser:
Editando la cabecera YAML se puede definir formatos de documentos distintos a HTML.
Entre las opciones de documentos con fines de impresión se encuentran:
PDF (en base a LaTeX)
PDF (en base a typst)
docx (archivo Word)
Para procesar documentos PDF de Quarto (documentos tradicionales pdf de RMarkdown) nuestra computadora debe cumplir con el requerimiento de tener instalado una distribución actualizada de Tex.
Existen varios motores PDF pero se recomienda utilizar TinyTeX (basado en TexLive) que podemos instalar fácilmente desde RStudio.
Otras distribuciones posibles para Windows son: MikTex o Tex Live, pero deben descargase e instalarse independientemente de RStudio.
TinyTeX es una distribución LaTeX personalizada, basada en TeX Live, que es pequeña en tamaño pero funciona bien en la mayoría de los casos, especialmente para usuarios de R.
Se instala ejecutando la siguiente linea en la Terminal de RStudio
Luego activamos la opción:
Use tinytex when compiling .tex files
en Global options de RStudio y reiniciamos.
Las cabecera básica de documentos PDF basados en LaTeX es:
* en este ejemplo, además activamos tabla de contenidos.
La mayoría de las opciones de ejecución vistas para HTML sirven para este tipo de documentos.
Quarto utiliza clases de documentos KOMA Script de forma predeterminada para libros y documentos PDF.
La opción de ejecución documentclass: posibilita cambiar de clase utilizando la configuración KOMA Script.
| Opción | Descripción |
|---|---|
| scrartcl | Es la clase estándar. Diseñada para artículos (más o menos cortos) |
| scrreprt | Clase reportes, similar a los libros. Se diferencian principalmente en los valores predeterminados. |
| scrbook | Diseñada para libros desde aproximadamente una docena hasta miles de páginas |
Seleccionar que clase de documento pdf queremos tendrá que ver con lo que estemos produciendo.
Por ejemplo, los artículos estan configurados predeterminandamente con una sola cara, lo mismo que los reportes. En cambio, los libros son de doble cara.
De todas maneras, las opciones se pueden cambiar con classoption: (oneside, twoside)
Ejemplo
Configurar el documento de clase scrbook automatizará muchas de las necesidades comunes para imprimir y encuadernar archivos PDF en un libro físico (es decir, los capítulos comienzan en páginas impares, tamaños de márgenes alternos, etc.)
| Opción | Descripción |
|---|---|
papersize |
Configura tamaño de papel |
lot |
Activa tabla de tablas |
lof |
Activa tabla de figuras |
fontsize |
Tamaño de fuente |
mainfont |
Fuente principal |
geometry |
Llama a paquete latex geometrías - define margenes, etc. |
Algunas librerías Latex como geometry vienen implementadas dentro de TinyTex y asociadas a la cabecera YAML de Quarto. Otras librerías pueden llamarse desde la opción include-in-header para inyectar comandos Latex.
Por ejemplo, incluyendo una fuente específica para el texto.
Quarto instalará todos los paquetes especificados mediante inclusiones que aún no haya instalado localmente durante la renderización del documento usando TinyTex.
Al crear un documento PDF, Pandoc permite el uso de código LaTex puro entre el markdown.
Si bien es muy conveniente para este formato, el código se ignora cuando se procesa en otros como HTML y Word.
Tengamos en cuenta que en algunos casos, el LaTeX puro requerirá paquetes de LaTeX adicionales (que deberemos incluir en la cabecera).
Typst es un nuevo sistema de composición tipográfica de código abierto basado en un lenguaje de marcas que está diseñado para ser tan potente como LaTeX y al mismo tiempo mucho más fácil de aprender y usar. Genera buenos resultados en PDF con tiempos de renderizado muy rápidos.
Dado que Typst está en desarrollo activo y fue incorporado en la última versión de Quarto, todavía existen algunas limitaciones en el soporte. Es decir, que algunas caracterísiticas nativas como el diseño de página avanzado no están del todo implementadas.
* en esta cabecera, además definimos 2 columnas para el documento.
La gran mayoría de opciones de cabecera generales de YAML para Quarto funcionan en typst.
Se puede controlar el diseño de la página mediante opciones de cabecera:
papersize: tamaño de la página (“a4”, “us-letter”, “us-legal”, etc)margin: márgenes de la página (top, right, bottom, left - medido en pulgadas in o centímetros cm)columns: cuantas columnas tendrá el diseño (por defecto 1 columna)mainfont: fuente principal (busca fuentes instaladas en el sistema pero se puede indicar rutas adicionales con font-paths)fontsize: tamaño de fuente base (medida en puntos pt)Al igual que el LaTeX se puede insertar bloques de código typst sin formato dentro del documento
Para obtener más información sobre marcado typst, consulte el tutorial aquí: https://typst.app/docs/tutorial/
Se puede cambiar la apariencia de bloques mediante llamadas nativas de Typst, utilizando la clase .block en un Div con los argumentos apropiados.
Typst tiene composición tipográfica matemática incorporada y utiliza su propia notación.
La notación va encerrada entre signos $, de forma similar al LaTeX.
Existen plantillas typst preconfeccionadas que se pueden utilizar o bien personalizar una propia.
| Formato | Uso |
|---|---|
| Poster | quarto use template quarto-ext/typst-templates/poster |
| IEEE | quarto use template quarto-ext/typst-templates/ieee |
| AMS | quarto use template quarto-ext/typst-templates/ams |
| Letter | quarto use template quarto-ext/typst-templates/letter |
| Fiction | quarto use template quarto-ext/typst-templates/fiction |
| Dept News | quarto use template quarto-ext/typst-templates/dept-news |
En el siguiente tutorial de typst guian en la creación de una plantilla.
También en el sitio Awesome Quarto hay páginas de plantillas de terceros disponibles para utilizar.
Las cabecera básica de documentos Word es:
* en el ejemplo, además activamos tabla de contenidos, con una profundidad de 2 y título de tabla “Contenidos” (en español).
La mayoría de las opciones de ejecución vistas para HTML sirven para este tipo de documentos.
Para personalizar la apariencia de los documentos resultantes en Word se puede añadir en la cabecera una plantilla con diseño modificado. Para esto se sigue el siguiente paso a paso:
reference-doc: con el nombre del documento anterior (ejemplo: plantilla.docx)Los dashboards o tableros de Quarto son archivos HTML que pueden ser:
Estáticos Se representan una sola vez y los datos no cambian - pueden incluir elementos dinámicos.
Programados Se representan a partir de un cronograma donde los datos se actualizan
Parametrizados Se modifican a partir de parámetros
Interactivo Mediante Shiny - requieren de servidor especial
El formato de la cabecera YAML de los tableros de Quarto es dashboard.
La salida generada es HTML y la estructura se asemeja al uso del paquete flexdashboard de RMarkdown.
Se puede definir como será la orientación y si se habilita el scrolling de la página.
Otras opciones específicas de la cabecera YAML para tableros son los logotipos y los botones de navegación.
Se reconocen alias para botones especiales predeterminados: linkedin, facebook, reddit, twitter y github. También se pueden crear botones personalizados a partir de íconos bootstrap.
logo: images/INE.gif
nav-buttons:
- linkedin
- twitter
- github
- facebook
- reddit
- icon: hospital
href: https://www.ine.gov.ar
target: _blankLos tableros constan de varios componentes:
Barra de navegación: ícono, título y autor junto con enlaces a subpáginas (si se define más de una página).
Páginas, filas, columnas y conjuntos de pestañas: las páginas, filas y columnas se definen mediante encabezados de Markdown (con atributos opcionales para controlar la altura, el ancho, etc.). Los conjuntos de pestañas se pueden utilizar para dividir aún más el contenido dentro de una fila o columna.
Tarjetas, barras laterales y barras de herramientas: las tarjetas son contenedores para gráficos, visualización de datos y contenido de formato libre. El contenido de las tarjetas generalmente se asigna a celdas en el documento fuente. Las barras laterales y las barras de herramientas se utilizan para presentar entradas dentro de tableros interactivos.
Los elementos de diseño básico son paginas, filas, columnas y pestañas.
Las paginas se definen con encabezados tamaño 1 (#)
Las filas y columnas se declaran con encabezados tamaño 2 (##)
Las pestañas utilizan la clase {.tabset} en filas tipo ## y cada pestaña se declara con un encabezado de tamaño 3 (###)
Las tarjetas que se ubican en las celdas que generan las filas, las columnas y/o las pestañas tienen un botón de expansión automático que maximiza la visualización.
La sintaxis de una tarjeta incluída en el diseño de página de un tablero tiene la forma:
El contenido de las tarjetas puede ser cualquiera de los elementos vistos anteriormente en Quarto basados en markdown o código HTML puro. También es útil incorporar valores dinámicos mediante código en línea.
Los cajas de valor son una excelente forma de mostrar valores simples de manera destacada dentro de un tablero.
La sintaxis dentro de un fragmento de código R tiene la siguiente estructura:
```{r}
#| content: valuebox
#| title: "Texto de la caja de valor"
list(
icon = "nombre-icono",
color = "color de la caja",
value = valor a mostrar)
)
```Los íconos pueden ser cualquiera de los 2000 disponibles en íconos de bootstrap
En color puede especificarse alguno de la paleta general hexadecimal o con palabras reservadas tipo primary, success, danger, etc. Estos colores variaran según el tema estético aplicado al tablero.
También se pueden crear cajas de valores usando Markdown simple, en cuyo caso normalmente se incluye el valor mediante una expresión en línea. Por ejemplo:
Se pueden incluir tablas dentro de estos tableros de dos formas:
Si lo que se quiere mostrar es una cantidad pequeña de observaciones se puede utilizar funciones de knitr o flextable sin problemas.
Estas tablas tendrán composición Markdown simples y llenan automáticamente al contenedor (desplazándose horizontal y verticalmente según sea necesario).
Si la tabla que queremos mostrar tiene muchos registros o es conveniente que se pueda ordenar de formas ascendente o descendente por alguna/s variable/s o hacer alguna busqueda particular, tenemos que hacer uso de algún paquete que incluya cierta interactividad.
Por ejemplo, el paquete DT, esta basado en una interfaz de JavaScript DataTables y agrega filtrado, paginación y ordenamiento a sus salidas.
Los gráficos son los elementos más comunes mostrados en tableros. Al igual que las tablas pueden ser estáticos o dinámicos/interactivos.
ggiraph, Plotly, highcharter, dygraphs, etc.Leaflet o mapviewEjemplo con ggiraph
Estos componentes dinámicos / interactivos basados en JavaScript mostrados en los paquetes para tablas y gráficos anteriores pertenecen a htmlwidgets.
En el sitio https://www.htmlwidgets.org/ perteneciente a RStudio / Posit se encuentran publicada la galería de librerías disponibles.
Cada uno de los 132 paquetes citados tienen su propia página con la referencia de sus funciones, modo de uso, ejemplos, etc.
Estos componentes se pueden incluir en dashboards con y sin servidor Shiny asociado y también en documentos HTML de Quarto.
Instituto Nacional de Epidemiología